/**
 * Created by zhaoxk on 2016/10/27.
 */
import React from 'react';
export default class TypeBar extends React.Component {
    constructor (props) {
        super(props);
        this.state = {
            items: this.props.items || []
        };
    }

    componentWillReceiveProps (prop) {
        this.setState({
            items: prop.items || []
        });
    }

    addType (id) {
        if (typeof this.props.addType === 'function') {
            this.props.addType(id);
        }
    }

    renderItems (items) {
        if (items.length > 0) {
            const _items = items.map(item => (
                <li
                    key={item.id}
                    id={item.id}
                    onClick={this.addType.bind(this, item.id)}
                >
                    <i>+</i>
                    {item.label}
                </li>
            ));
            return (
                <div>
                    <h2 className="barTitle">添加病例控件</h2>
                    <ul id="_typeBar">{_items}</ul>
                </div>
            );
        }
        return (<div className="nonComp">暂无病例控件</div>);
    }

    render () {
        return this.renderItems(this.state.items);
    }
}
